<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>超链接标签</title>
    <style>
        a{
            text-decoration: none;
            color: #FF0000;
            font-weight: bolder;
            font-family: 华文琥珀;
            background: aqua;
            width: 50px;
            height: 50px;
            display: inline-block; /*变成块元素使宽高生效*/
            text-align: center;
            line-height: 50px;
            border-radius:10px ; /*圆角边框*/
        }
        a:hover{   /*鼠标经过变颜色*/
            background: chartreuse;
            color: #FAA53B;
        }
        a[href="text"]{
            background: fuchsia;
        }
        a[id]{
            background: #0D7114;
        }
        a[href^="http://www.baidu.com"]{
            background: deeppink;
        }
        a[href$="000"]{
            background: lightcoral;
        }
        a[href*="55"]{
            background: white;
        }
    </style>
</head>
<body>

<!--/*属性选择器	功能描述*/-->
<!--/*E[attr]	选择匹配具有属性attr的E元素*/-->
<!--/*E[attr=val]	选择匹配具有属性attr的E元素,并且属性值为val（其中val区分大小写）*/-->
<!--/*E[attr^=val]	选择匹配元素E，且E元素定义了属性attr，其属性值是以val开头的任意字符串*/-->
<!--/*E[attr$=val]	选择匹配元素E，且E元素定义了属性attr，其属性值是以val结尾的任意字符串*/-->
<!--/*E[attr*=val]	选择匹配元素E，且E元素定义了属性attr，其属性值包含了“val”，换句话说，字符串val与属性值中的任意位置相匹配-->

<a href="#" id="a1">1</a>
<a href="text">2</a>
<a href="http://www.baidu.com">3</a>
<a href="text">4</a>
<a href="#14525828558">5</a>
<a href="text">6</a>
<a href="#0000">7</a>
<a href="text">8</a>

</body>
</html>